export default class Snake {
    // 蛇头
    head: HTMLElement

    // 蛇身
    // 注意：其本身是个数组
    bodies: HTMLCollection

    // 蛇容器
    snakeBox: HTMLElement

    constructor() {
        this.snakeBox = document.getElementById('snake')!
        this.head = document.querySelector('.snake-body-item')!
        this.bodies = this.snakeBox.getElementsByTagName('span')
    }

    get headX() {
        return this.head.offsetLeft
    }

    get headY() {
        return this.head.offsetTop
    }

    set headX(value: number) {
        this.head.style.left = value + 'px'
    }

    set headY(value: number) {
        this.head.style.top = value + 'px'
    }

    addBody() {
        this.snakeBox.insertAdjacentText('beforeend', '<div class="snake-body-item"></div>')
    }
}